<template>
  <!--优惠活动标签-->
  <div style="background:white">
    <!--领取优惠券-->
    <div class="preferential" style="text-align: left" v-if="type == 'conpon' && couponListCanBeGet.length">


      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">用券</label>
      <span
        class="cjy-sec-title"
        style=" max-width:50%">      {{'可用优惠券' + couponListCanBeGet.length}}张</span>
      <a @click="getDiscountCoupon"> 领取优惠券</a>
    </div>


    <!--满赠-->
    <div v-if=" buyPresent.length >0 && (item.prefWay==2 ||item.prefWay==1)  "
         v-for="(item ,index) in buyPresent "

         @click="showFree(item)"
         style="text-align: left">

      <buy-more-list pageType="cartList" slot="content" :buyMoreDetail="item">
      </buy-more-list>

    </div>
    <!--满赠-->
    <div v-if=" buyPresentNG.length >0 "
         v-for="(item,index) in buyPresentNG"

         class="preferential " style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">买赠</label>
      <span class="cjy-sec-title">
        {{item.promName}}
    </span>
      <a v-if="item.beUsed == 1" @click="goDetail">去凑单</a>
      <!--<span v-else-if="item.beUsed == 3" class="cjy-sec-title">可参与次数不足</span>-->
    </div>

    <!--阶梯赠品-->
    <div @click=" showBuyMoreLadder(item.promotLadderVOList)"
         v-if=" buyPresent.length >0 && selectLadderList && item.prefWay==3"
         v-for="(item, index) in buyPresent"

         class="preferential" style="text-align: left">

      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">买赠</label>
      <span
        class="cjy-sec-title">  {{
        findSelectGift(selectGiftList, item).giftVO ? findSelectGift(selectGiftList, item).giftVO.giftName : '未选择优惠赠品'
        }}   </span>
      <a v-if=" findSelectGift(selectGiftList, item).giftVO"> 已选</a>
      <a v-else> 去选取</a>
    </div>

    <!--多买-->
    <div v-if=" overBuy.length >0 "
         v-for="(item,index) in overBuy" class="preferential"
         style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">多买</label><span
      class="cjy-sec-title">{{item.promName}}</span>
      <span class="cjy-span">已选</span>
    </div>
    <!--多买-->

    <div v-if=" overBuyNG.length >0 "
         v-for="(item,index) in overBuyNG"
         class="preferential" style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">多买</label> <span
      class="cjy-sec-title">{{item.promName}}

    </span>
      <a v-if="item.beUsed == 1" @click="goDetail"> 去凑单</a>
      <!--<span v-else-if="item.beUsed == 3" class="cjy-sec-title">可参与次数不足</span>-->
    </div>

    <!--返利-->
    <div v-if=" rebate.length >0 &&  (item.prefWay == 1  || item.prefWay == 2) "
         v-for="(item,index) in rebate"
         @click=" showChoseNum(item)">
      <buy-more-list pageType="cartList" slot="content" :buyMoreDetail="item">
      </buy-more-list>
    </div>

    <!--换购-->
    <div @click=" showSelectLadder(item.promotLadderVOList)" v-if="  item.prefWay  == 3 "
         v-for="(item, index) in rebate"
         class="preferential" style="text-align: left">

      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">返利</label>
      <span class="cjy-sec-title">
        {{findSelectLadder(selectLadderList, item).times ? findSelectLadder(selectLadderList, item).giftName : '未选择优惠赠品'}}
      </span>


      <a v-if=" findSelectLadder(selectLadderList, item).times">
        {{(selectLadderList, item).addMoney ? '已加价：¥' + parseFloat(findSelectLadder(selectLadderList,
        item).addMoney).toFixed(2) : '已选'}}</a>
      <a v-else>去选取</a>
    </div>

    <!--返利NG-->
    <div v-if=" rebateNG.length >0 "
         v-for="(item,index) in rebateNG"
         class="preferential" style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">返利</label>
      <span class="cjy-sec-title">{{item.promName}}</span>
      <a v-if="item.beUsed == 1" @click="goClassify(item)">去凑单</a>
      <!--<span v-else-if="item.beUsed == 3" class="cjy-sec-title">可参与次数不足</span>-->
    </div>


    <!--满减-->
    <div v-if=" fullCut.length >0 "
         v-for="(item,index) in fullCut"
         class="preferential" style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">满减</label>
      <span class="cjy-sec-title">{{item.promName}}</span>
      <span class="cjy-span">{{fullDiscountTitleDes(true, item)}}</span>
    </div>


    <!--满减-->
    <div v-if=" fullCutNG.length >0 "
         v-for="(item,index) in fullCutNG"
         class="preferential" style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">满减</label> <span
      class="cjy-sec-title">{{item.promName}}
    </span>
      <a v-if="item.beUsed == 1" @click="goClassify(item)">去凑单</a>
      <!--<span v-else-if="item.beUsed == 3" class="cjy-sec-title">可参与次数不足</span>-->
    </div>

    <!--满折-->
    <div v-if=" fullDiscount.length >0 "
         v-for="(item,index) in fullDiscount"
         class="preferential" style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">折扣</label> <span
      class="cjy-sec-title"> {{item.promName}}
    </span> <span class="cjy-span">{{fullDiscountTitleDes(true, item)}}</span>
    </div>

    <!--满折-->
    <div v-if=" fullDiscountNG.length >0 "
         v-for="(item,index) in fullDiscountNG"
         class="preferential" style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">折扣</label> <span
      class="cjy-sec-title">
      {{item.promName}}</span>
      <a v-if="item.beUsed == 1 " @click="goClassify(item)">去凑单</a>
      <!--<span v-else-if="item.beUsed == 3" class="cjy-sec-title">可参与次数不足</span>-->
    </div>


    <!--活动-->
    <div v-if=" regularVOListOK.length >0 "
         v-for="(item,index) in regularVOListOK"
         class="preferential"
         style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">活动</label> <span
      class="cjy-sec-title">
      {{item.activityName}} {{item.packageName}}
    </span>
      <span class="cjy-span">已选</span>
    </div>

    <!--活动-->
    <div v-if=" regularVOListNG.length >0 "
         v-for="(item,index) in regularVOListNG"
         class="preferential"
         style="text-align: left">
      <label class="aui-label-danger aui-label-outlined"
             style="margin-left: 0.5rem">活动</label>
      <span class="cjy-sec-title">{{item.activityName}}{{item.packageName}} </span>
      <a
        @click=" $router.push({path:'regulardetail',query:{regularId:item.regularId ,regularPackageId:item.regularPackageId }})  ">去凑单</a>
    </div>

    <!--套餐-->
    <div v-if=" fixedPackageListOK.length >0 "
         v-for="(item,index) in fixedPackageListOK"
         class="preferential"
         style="text-align: left">
      <label class="aui-label-danger aui-label-outlined"
             style="margin-left: 0.5rem">套餐</label>
      <span class="cjy-sec-title">{{item.packageName}}
    </span>
      <span class="cjy-span">已选</span>
    </div>

    <!--套餐-->
    <div v-if=" fixedPackageListNG.length >0 "
         v-for="(item,index) in fixedPackageListNG"
         class="preferential"
         style="text-align: left">
      <label class="aui-label-danger aui-label-outlined" style="margin-left: 0.5rem">套餐</label> <span
      class="cjy-sec-title">{{item.packageName}}
    </span>
      <a @click=" $router.push({path:'regulardetail',query:{fixedPackageId:item.fixedPackageId}}) ">去凑单</a>
    </div>


  </div>
</template>

<script>
  import {Toast} from '@/utils/toast'
  import {queryDisount} from '@/utils/ReturnAxios'
  import BuyMoreList from './BuyMoreList.vue'
  import CartShowRegular from '@/real-components/CartShowRegular'

  export default {
    data() {
      var promotionalKeyList = [
        'buyPresent',//单品 买赠
        'specialOffer',// 单品 特价
        'discount', //单品 折扣
        'overBuy',//单品 多买
        'rebate', // 订单返利
        'fullCut',// 满减
        'fullDiscount',//满折
      ] // 配置所有活动的类型


      var dataObj = {}
      for (var key of promotionalKeyList) {
        dataObj[key] = []
        dataObj[key + 'NG'] = []
      }
      return {
        ...dataObj,
        promotionalVoListNG: [],
        promotionalVoListOK: [],
        regularVOListNG: [],
        regularVOListOK: [],
        fixedPackageListOK: [],
        fixedPackageListNG: [],
        DDLL: [],
        promotionalKeyList,
        ladderList: [],
        ladder: [],
        buyMoreList: 0,
        goodsClassCode: ''
      }
    },
    components: {
      BuyMoreList,
      CartShowRegular
    },
    props: {
      brandName: {
        type: String,
        default: ''
      },
      ishShowDisable: {
        type: Boolean,
        default: true
      },
      goodsCode: {
        type: String,
        default: ''
      },
      type: {
        type: String,
        default: ''
      },
      prodVo: {
        type: Object,
        default: () => {
        }
      },
      couponListCanBeUsed: {
        type: Array,
        default: () => []
      },
      couponListCanBeGet: {
        type: Array,
        default: () => []
      }
    },
    methods: {
      //当 订单活动不满足的情况下跳转分类
      goClassify(item) {
        var prefRange = item.prefRange  //活动类型
        var brandName = this.brandName

        if (prefRange == 1) {
          this.router.push({path: 'detail', query: {code: this.goodsCode}})
        } else if (prefRange == 2) {
          this.$router.push({path: 'goodsClassify', query: {classCode: this.goodsClassCode}})
        }
        else if (prefRange == 3) {
          this.$router.push({path: 'searchResult', query: {clue: brandName}})
        }
        else if (prefRange == 4) {
          this.$router.push({path: 'home'})
        }
      },
      goDetail() {
        this.$router.push({path: 'detail', query: {code: this.goodsCode}})
      },

      //标题提示
      buyPresentTitleDes(isOk, item) {
        var prefWay = item.prefWay
        var eachFullNum = item.eachFullNum
        var fullCondition = item.fullCondition
        var giftVO = item.giftVO || {}

        if (prefWay == 2 || prefWay == 3) {

          if (isOk) {
            return `每满件${eachFullNum}可送${giftVO ? giftVO.giftName : '礼包'}`
          } else {
            return `已送${giftVO.times }件`
          }
        } else if (prefWay == 1) {

          if (isOk) {
            return `满件${fullCondition}可送${giftVO ? giftVO.giftName : '礼包'}`
          } else {
            return `已送${giftVO.times}件`
          }
        }
      },

      specialOfferTitleDes(isOk, item) {

        var batchSpecialPrice = item.batchSpecialPrice //批量特价
        var batchReducePrice = item.batchReducePrice // 批量减价
        var limits = item.limits //0不限购
        var giftVO = item.giftVO

        var text = `${batchSpecialPrice ? '特价出售只需 ¥' + batchSpecialPrice : '每件减价¥' + batchReducePrice}`
        if (!limits) {
          return text
        } else {
          return '前' + limits + '件' + text
        }
      },

      discountTitleDes(isOk, item) {
        var batchDiscoun = item.batchDiscoun
        var resultMinusSale = item.resultMinusSale
        var limits = item.limits
        var text = ` ${limits ? '前' + limits + '件' : '已选商品'} 可享受${resultMinusSale} 折`
        return text

      },
      overBuyTitleDes(isOk, item) {
        var minusNum = item.minusNum
        var minusSale = item.minusSale
        var eachFullNum = item.eachFullNum
        var fullCondition = item.fullCondition
        var resultMinusSale = item.resultMinusSale
        var resultMinusNum = item.resultMinusNum
        var promotionalLadderList = item.promotionalLadderList
        var prefWay = item.prefWay
        var text = `${minusNum ? '减' + minusNum + '件' : '打' + minusSale + '折'}`
        var every = eachFullNum ? '每满' + eachFullNum + '件' + text : ''
        var full = fullCondition ? '前' + fullCondition + '件' + text : ''
        if (prefWay == 3) {

          return resultMinusNum ? '已减少' + resultMinusNum + '件结算价格' : '已打折' + resultMinusSale
        }

        else {
          return full + every + text
        }
      },

      fullDiscountTitleDes(isOk, item) {
        var resultMinusMoney = item.resultMinusMoney
        var resultMinusSale = item.resultMinusSale

        if (resultMinusMoney) {
          return '已优惠¥' + resultMinusMoney
        } else if (resultMinusSale) {
          return '已打' + resultMinusSale + '折'
        } else {
          return '已满足'
        }
      }
      ,
      //回显已选礼品
      findSelectGift(selectLadderList, item) {
        var returnData
        var promLadderId
        var ladder = item
        // 选出promId
        var goodsCode = this.goodsCode
        var promId = ladder.promId
        var isPrefRange = selectLadderList.prefRange != 1

        returnData = selectLadderList.find((item) => {
          return promId == item.promId && (isPrefRange || item.goodsCode == goodsCode)
        })

        if (returnData) {
          promLadderId = returnData.promLadderId

          var findLadderList = item.promotLadderVOList.find((item) => {
            return promLadderId == item.promLadderId
          })
          if (findLadderList) {
            if (findLadderList.giftVO.times > 0) {
              return returnData
            } else {
              this.$store.commit('cjy/SPLICE_SELECT_BUY_MORE_LIST', promId)
            }
          }
        }

        return {}


      },


      //回显已选 换购
      findSelectLadder(selectLadderList, item) {
        var returnData
        var promLadderId
        var ladder = item
        // 选出promId
        var promId = ladder.promId
        // 查找已选择列表中对应的Id
        returnData = selectLadderList.find((item) => {
          return promId == item.promId //选取出对应的已选加赠
        })
        if (returnData) {
          promLadderId = returnData.promLadderId

          var findLadderList = item.promotLadderVOList.find((item) => {
            return promLadderId == item.promLadderId
          })
          if (findLadderList) {
            var returnObj
            var addMoney = findLadderList.addMoney
            var giftVO = findLadderList.giftVO
            var couponVO = findLadderList.couponVO
            if (giftVO && giftVO.times > 0) {
              return {
                addMoney,
                giftName: giftVO.giftName,
                times: giftVO.times
              }
            } else if (couponVO && couponVO.times > 0) {
              return {
                addMoney,
                giftName: couponVO.couponName,
                times: couponVO.times
              }
            }
            else {
              this.$store.commit('cjy/SPLICE_SELECT_LADDER_LIST', promId)
            }
          }

        }
        return {}

      },


      // 弹出优惠券领取
      async getDiscountCoupon() {
        this.$emit('getDiscountCoupon')
      }
      ,
      //初始化 每种活动的数据
      initData(data) {

        if (!data) {
          return
        }
        var promotionalVoList = data.promotionalVoList || []
        var ishShowDisable = this.ishShowDisable
        this.goodsClassCode = data.classCode
        this.promotionalVoListNG = ishShowDisable ? promotionalVoList.filter((item) => {
          return item.beUsed == 1
        }) : []

        this.promotionalVoListOK = this.filter = promotionalVoList.filter((item) => {
          return item.beUsed == 2
        })
        this.regularVOListOK = this.getRegular(data.regularVOListOK)
        this.regularVOListNG = ishShowDisable && data.regularVOListNG.length > 0 ? this.getRegular(data.regularVOListNG) : []
        this.fixedPackageListOK = data.fixedPackageListOK ? data.fixedPackageListOK : []
        this.fixedPackageListNG = ishShowDisable && data.fixedPackageListNG ? data.fixedPackageListNG : []
        this.initRegular()
      },
      //初始化活动
      initRegular() {
        //promName
        var promotionalKeyList = this.promotionalKeyList
        var promotionalVoListOK = this.promotionalVoListOK
        var promotionalVoListNG = this.promotionalVoListNG
        var regularVOListOK = this.regularVOListOK
        for (var key of promotionalKeyList) {
          //筛选符合
          this[key] = this.promotionalVoListOK.filter(
            (item) => {
              return key == item.saleType
            })
          //筛选 不符合
          this[key + 'NG'] = this.promotionalVoListNG.filter(
            (item) => {
              return key == item.saleType
            }
          )
        }
      },
      //弹出 阶梯换购
      showSelectLadder(item) {
        this.$emit('showSelectLadder', item)
      },
      //弹出 阶梯礼品
      showBuyMoreLadder(item) {
        var config = {
          ladderList: item,
          goodsCode: this.goodsCode
        }
        this.$emit('showBuyMoreLadder', config)
      },
      //弹出 每满赠
      showChoseNum(item) {
        this.$emit('showChoseNum', item)

      },

      //弹出 免费赠品
      showFree(item) {
        this.$emit('showFree', item)
      },
      //组套餐筛选
      getRegular(data) {
        var regular = []
        for (var list  of data) {
          var activityName = list.activityName
          for (var item of list.regularPackageList) {

            item.activityName = activityName
            regular.push(item)
          }
        }
        return regular
      },
      //转换可用优惠券格式
      translateCouponListCanBeUsed(data) {
        var count = 0

        data.map((item) => {
          count += item.couponCodeList.length || 0
        })
        return count
      },

    },
    watch: {
      prodVo(data) {

        this.initData(data)
      }
      ,
    }
    ,
    computed: {
      buyMoreData() {
        return this.$store.getters['cjy/buyMoreData']
      },

      selectLadderList() {
        return this.$store.getters['cjy/selectLadderList']
      },

      selectGiftList() {
        return this.$store.getters['cjy/selectGiftList']
      },
    }
    ,
    created() {
      var prodVo = this.prodVo
      this.initData(prodVo)
    }
    ,
    selectJia() {
      PSEvent.trigger("selectJia");
    }
  }
</script>

<style scoped>


  .cjy-sec-title {
    max-width: 50%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    margin-left: 0.5rem;
    vertical-align: middle;
  }

  .preferential {
    padding: 0.2rem 0.3rem 0.2rem 0;
    line-height: 1rem;
    background: rgba(255, 245, 184, 0.55)

  }

  .preferential a {
    margin-top: 0.2rem;
    padding-right: 1rem;
  }

  .preferential .cjy-span, .preferential .cjy-add-sub {
    float: right;
    padding-right: 1rem;
    color: #EF5423;
    margin-top: 0.2rem;
  }

  .cjy-add-sub-showNumb {
    height: 100%;
    width: 1rem;
    text-align: center;
    vertical-align: middle;
    float: right;
  }

  .cjy-add-button, .cjy-sub-button {
    border: 1px solid rgb(234, 57, 57);
    border-radius: 50%;
    height: 1rem;
    width: 1rem;
    display: block;
    position: relative;
  }

  .cjy-add-button::after, .cjy-sub-button::after {
    content: '';
    width: 0.6rem;
    height: 0rem;
    border-top: thin solid rgb(234, 57, 57);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .cjy-sub-button {
    border: 1px solid gray;
  }

  .cjy-sub-button::after {
    border-top: thin solid gray;
  }

  .cjy-add-button::before {
    content: '';
    width: 0;
    height: 0.6rem;
    border-left: thin solid rgb(234, 57, 57);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .cjy-button-box {
    float: right;
    padding: 2px;
  }

  .cjy-right {
    float: right !important;
    color: rgb(234, 57, 57);
  }

  .cjy-der-down {
    position: relative;
    display: inline-block;
    padding-right: 1rem;
    float: right !important;
    color: rgb(234, 57, 57);
  }

  .cjy-der-down:before {
    content: '';
    width: 0.4rem;
    height: 0.4rem;
    position: absolute;
    top: 47%;
    right: 0.3rem;
    margin-top: -0.2rem;
    background: transparent;
    border: 1px solid rgb(234, 57, 57);
    border-top: none;
    border-right: none;
    z-index: 2;
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
</style>
